// 5. 全局--发布订阅对象代码封装

// 我们再来看看我们传统的ajax请求吧，比如我们传统的ajax请求，请求成功后需要做如下事情：

//  1. 渲染数据。

//  2. 使用数据来做一个动画。

// 那么我们以前肯定是如下写代码：

/**
 $.ajax(“http://127.0.0.1/index.php”,function(data){
    rendedData(data);  // 渲染数据
    doAnimate(data);  // 实现动画 
  });
 */

// 假如以后还需要做点事情的话，我们还需要在里面写调用的方法；这样代码就耦合性很高，那么我们现在使用发布-订阅模式来看如何重构上面的业务需求代码；

/**
   $.ajax(“http://127.0.0.1/index.php”,function(data){
      Obj.trigger(‘success’,data);  // 发布请求成功后的消息
  });
  // 下面我们来订阅此消息，比如我现在订阅渲染数据这个消息；
  Obj.listen(“success”,function(data){
    renderData(data);
  });
  // 订阅动画这个消息
  Obj.listen(“success”,function(data){
    doAnimate(data); 
  });
 
 */
// 为此我们可以封装一个全局发布-订阅模式对象；如下代码：


var Event = (function(){
  var list = {},
        listen,
        trigger,
        remove;
        listen = function(key,fn){
          if(!list[key]) {
              list[key] = [];
          }
          list[key].push(fn);
      };
      trigger = function(){
          var key = Array.prototype.shift.call(arguments),
               fns = list[key];
          if(!fns || fns.length === 0) {
              return false;
          }
          for(var i = 0, fn; fn = fns[i++];) {
              fn.apply(this,arguments);
          }
      };
      remove = function(key,fn){
          var fns = list[key];
          if(!fns) {
              return false;
          }
          if(!fn) {
              fns && (fns.length = 0);
          }else {
              for(var i = fns.length - 1; i >= 0; i--){
                  var _fn = fns[i];
                  if(_fn === fn) {
                      fns.splice(i,1);
                  }
              }
          }
      };
      return {
          listen: listen,
          trigger: trigger,
          remove: remove
      }
})();
// 测试代码如下：
Event.listen("color",function(size) {
  console.log("尺码为:"+size); // 打印出尺码为42
});
Event.trigger("color",42);